<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基础复习</title>
</head>
<body>

<script type="text/javascript">
    // Object.defineProperty方法复习 （数据代理基础）
    let number = 88;
    let person = {
        name: 'ZhangSan',
        sex: 'woman',
        //age:23
    }

    Object.defineProperty(person, 'age', {
        // value: 18,
        // 控制属性是否可以枚举, 默认false
        enumerable: true,
        // 控制属性是否可以修改, 默认false
        writable: true,
        //控制属性是否可以删除, 默认false
        configurable: true,

        //当读取age属性时, get函数就会被调用（每次读取都会调用）
        get() {
            // age属性会随着number值的变化而变化
            return number;
        }

    });

    /*
    *   VUE中的数据代理
    *       通过vm对象来代理data对象中属性的操作(读/写)
    *   基本原理
    *       通过object.defineProperty()把data对象中所有属性添加到vm上
    *       为每一个添加到vm上的属性, 都指定一个getter/setter（去操作内部的读写方法）
    * */

    console.log(person)

</script>

</body>
</html>